<template>
    <div class="mainbody">
      <el-breadcrumb separator-class="el-icon-arrow-right">
          <el-breadcrumb-item >{{ mainName }}</el-breadcrumb-item>
          <el-breadcrumb-item >{{facName}}</el-breadcrumb-item>
          <p>&nbsp;</p>
      </el-breadcrumb>
      <el-main>
        <div class="addAddressForm" v-if="routerFlag == 'addAddress'">
          <el-row>
            <el-col :span="18">
              <el-menu
                :default-active="this.$route.path" 
                :router="true"
                mode="horizontal"
                text-color="#3b3b3a"
                active-text-color="#f66715">
                <el-menu-item class="sort-item" @mouseenter="setSortHover" index="/personalHomepage/purchasedGoods/getGoodsOrder"><h3>所有订单({{ OrderLength }})</h3></el-menu-item>
                <el-menu-item class="sort-item" @mouseenter="setSortHover" index="/personalHomepage/purchasedGoods/getGoodsPay"><h3>待付款</h3></el-menu-item>
                <el-menu-item class="sort-item" @mouseenter="setSortHover" index="/personalHomepage/purchasedGoods/getDeliverGoods"><h3>物流中</h3></el-menu-item>
                <el-menu-item class="sort-item" @mouseenter="setSortHover" index="/personalHomepage/purchasedGoods/getReceiveGoods"><h3>订单完成</h3></el-menu-item>
                <el-menu-item class="sort-item" @mouseenter="setSortHover" index="/personalHomepage/purchasedGoods/getGoodsComment"><h3>待评价</h3></el-menu-item>
              </el-menu>
            </el-col>
            <el-col :span="6">
            </el-col>
        </el-row>
        <el-row>
          <router-view></router-view> 
        </el-row>
        </div>
      </el-main>
    </div>
  </template>
  
  <script>
  import {userInfo ,deleteGoodsBuyRecordsByUserNameAndBuyRecordId,getAllGoodsOrder} from "../../ajax/get"
//   import {addGoodsOrder} from "../../ajax/post"
  export default {
      name: "purchasedGoods",
      data () {
          return {
            mainName:"全部功能",
            facName:"我的收藏",
            routerFlag: "addAddress",
            addAddressForm:{},//添加新的收获地址对象
            getAddressForm:{},//获取收获地址对象
            message:[],//获取收获地址信息
            OrderLength:0,//所有订单数量
            GetAllGoodsOrder:[],//所有订单数量
          };
      },
      methods: {
               // 查找用户信息
        findUserInfo(userName) {
          userInfo(userName).then(res => {
            console.log("用户信息:",res);
            this.nickName = res.data.data.nickName;
            this.userName = res.data.data.userName;
          })
          // 获取所有订单
          getAllGoodsOrder(sessionStorage.getItem("userName")).then(com => {
              this.GetAllGoodsOrder = com.data.data;
              this.OrderLength = this.GetAllGoodsOrder.length;
              console.log(this.OrderLength,"所有订单数量");
          })
        },
        setSortHover: function () {
          $(".sort-item").hover(function(){
              $(this).css("color","white");
              $(this).addClass("skin-bg")
          }, function(){
              $(this).css("color","#f66715");
              $(this).removeClass("skin-bg")
          });
        },
        DelGoodsOrder(){
          deleteGoodsBuyRecordsByUserNameAndBuyRecordId().then(res =>{
            console.log("删除订单",res);
          })
        }
      },
      created() {
        this.findUserInfo(sessionStorage.getItem("userName"));
      }
  }
  </script>
  
  <style scoped>
  </style>